{include file="admin/header.tpl" title="header" }
		  {* $post|var_dump *}
          
          {if isset($post.question_id) }
          	{assign var='action' value='update'}
            {assign var='page_heading' value='Edit'}
          {else} 
          	{assign var='action' value='add'}
            {assign var='page_heading' value='Add'}
          {/if}

   <script src="{$baseurl}/javascript/admin/trivia.js"></script>
    <div id="content">
    
    
    {php} echo display_msg(); {/php}
    <div class="error" id="main_error_div" style="display:none;"></div>
    {if isset($post.question_id) }
          	<h2>Edit Trivia</h2>
          {else} 
          	<h2>Add Trivia</h2>
          {/if}
        {if isset($post.question_id) }
      	 <div class="lstable">
           <form name="cityfrm"  id="cityfrm" method="post" onsubmit="return triviaFrmValidation();">
           	<input type="hidden" name="action" id="action" value="{$action}">
            <input type="hidden" name="question_id" id="question_id" value="{$post.question_id}">
            <input type="hidden" name="option_counter" id="option_counter" value="0" />
            <input type="hidden" name="option_counter" id="option_counter" value="{$trivia_options|@count}">
            
        	<table width="100%" border="0" cellspacing="0" cellpadding="0">
          
           <tr>
            <td width="12%" align="left" valign="middle"><strong>Category : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left">{$category_dropdown}</td>
           <td width="23%"></td>
            <td width="10%">&nbsp;</td>
          </tr>
           
            <tr>
            <td width="12%" align="left" valign="middle"><strong>Level : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left">{$level_dropdown}</td>
           <td width="23%"></td>
            <td width="10%">&nbsp;</td>
          </tr>  
          
          <tr>
            <td width="12%" align="left" valign="middle"><strong>Question : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left"><input type="text" name="question" id="question" value="{$post.question}" maxlength="255" style="width:250px;" /></td>
           <td width="23%"><strong><a onclick="addNumberOfOption(1);" href="javascript:void(0)">Add answer option(s)</a></td>
            <td width="10%">&nbsp;</td>
          </tr>
          
          	<tr>
          	<td colspan="5" align="left" > 
           
         	 
          {foreach from=$trivia_options item=row}
          
            {assign var='counter' value=$counter+1} 
                <div id="div_{$counter}"> 
                  <table width="100%">
                   <tr>
                    <td width="11%" align="left" valign="middle"><strong>Options {$counter}</strong></td>
                    <td width="30.8%" align="left" valign="middle">&nbsp;<input type="text" name= "option[]" id= "options_id_{$counter}" value="{$row.quiz_option}">
                    <input type="hidden" name="option_id_exist[]" value="{$row.quiz_option_id}">
                     </td>
                    <td width="60.2%" valign="middle">
                    <span><a href='javascript:void(0)' onclick='updateAnswer("{$counter}")'>Make it Answer</a></span>
                    {if $row.option_in_answer ne 1}
                    <a onclick="removeTriviaOptions({$row.quiz_option_id}); removeElement({$counter})" class="close_span">&nbsp;</a>
                    {/if}
                    </td>
                   </tr>
                   <tr>
                   	  <td></td>	
                   </tr>
                   </table>
               </div>
              {/foreach}
              
           
            </td>
          </tr>
          <tr>
          	<td colspan="5"><div id="show_no_of_option" class="engineTable"></div></td>
          </tr>
          <tr>
            <td width="124" align="left" valign="middle"><strong>Answer  : <span class="mandatory">*</span></strong></td>
            <td width="264" align="left" valign="middle">
            <input type="text" name="answer" id="answer" value="{$option_answer}" maxlength="255" style="width:250px;" /></td>
            <td width="56">&nbsp;</td>
            <td width="252">&nbsp;</td>
            <td width="158">&nbsp;</td>
            
          </tr>
          <tr>
            <td width="124" align="left" valign="middle"><strong>Question Date  : <span class="mandatory">*</span></strong></td>
            <td width="264" align="left" valign="middle">
            <input  readonly="readonly" type="text" name="question_date" id="question_date" class="datePicker" value="{$post.question_date}" maxlength="255" style="width:250px;" /></td>
            <td width="56">&nbsp;</td>
            <td width="252">&nbsp;</td>
            <td width="158">&nbsp;</td>
            
          </tr>
          
           <tr>
          	<td>&nbsp;</td>
            <td  colspan="2" align="left"><input name="submit" class="btncss" type="submit" value="Save" />
            &nbsp;<input class="btncss" type="button" onclick="location.href='{$baseurl}/admin/trivia.php?&pg={$pg}&ipp={$ipp}&new_page_limit={$new_page_limit}&title={$title}'" value="Back" />
            </td>
            
          </tr>
          </table>
          </form>
      </div>
         {else}
          <div class="lstable">
           <form name="cityfrm"  id="cityfrm" method="post" onsubmit="return triviaFrmValidation();">
           	<input type="hidden" name="action" id="action" value="{$action}">
             <input type="hidden" name="question_id" id="question_id" value="{$post.question_id}">
             <input type="hidden" name="option_counter" id="option_counter" value="{$trivia_options|@count}">
             <input type="hidden" name="option_counter" id="option_counter" value="0" />
        	<table width="100%" border="0" cellspacing="0" cellpadding="0">
          
          <tr>
            <td width="12%" align="left" valign="middle"><strong>Category : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left">{$category_dropdown}</td>
           <td width="23%"></td>
            <td width="10%">&nbsp;</td>
          </tr>
           <tr>
            <td width="12%" align="left" valign="middle"><strong>Level : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left">{$level_dropdown}</td>
           <td width="23%"></td>
            <td width="10%">&nbsp;</td>
          </tr>  
             
          <tr>
            <td width="12%" align="left" valign="middle"><strong>Question  : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left" valign="middle">
            <input type="text" name="question" id="question" value="{$post.question}" maxlength="255" style="width:250px;" /></td>
            <td width="23%"><a onclick="addNumberOfOption(1);" href="javascript:void(0)">Add answer option(s)</a></td>
            <td width="10%">&nbsp;</td>
            
          </tr>
          <tr>
          	<td colspan="5">
            <div id="show_no_of_option" class="engineTable"></div>
            </td>
          </tr>
          
          <tr>
            <td width="12%" align="left" valign="middle"><strong>Answer  : <span class="mandatory">*</span></strong></td>
            <td width="24%" align="left" valign="middle">
            <input type="text" name="answer" readonly="readonly" id="answer" value="{$post.question}" maxlength="255" style="width:250px;" /></td>
            <td width="13%">&nbsp;</td>
            <td width="31%">&nbsp;</td>
            <td width="20%">&nbsp;</td>
            
          </tr>
          <tr>
            <td width="13%" align="left" valign="middle"><strong>Question Date  : <span class="mandatory">*</span></strong></td>
            <td width="23%" align="left" valign="middle">
            <input  readonly="readonly" type="text" name="question_date" id="question_date" class="datePicker" value="{$post.question_date}" maxlength="255" style="width:250px;" /></td>
            <td width="13%">&nbsp;</td>
            <td width="31%">&nbsp;</td>
            <td width="20%">&nbsp;</td>
            
          </tr>
          <tr>
          	<td>&nbsp;</td>
            <td  colspan="2" align="left"><input name="submit" class="btncss" type="submit" value="Save" />
            &nbsp;<input class="btncss" type="button" onclick="location.href='{$baseurl}/admin/trivia.php?&pg={$pg}&ipp={$ipp}&new_page_limit={$new_page_limit}&question={$question}'" value="Cancel" />
            </td>
            
          </tr>
          </table>
          </form>
      </div>   
        {/if} 
    </div>
    <script>
		{literal}
			 var currentTime = new Date();
			 var month = currentTime.getMonth() + 1;
			 var day = currentTime.getDate();
			 var year = currentTime.getFullYear();
			 $('#question_date').datepicker({minDate: new Date(year, month - 1, day),  maxDate: new Date(2020, 1 - 1, 1)});
		{/literal}
	</script>
 {include file="admin/footer.tpl" title="footer"}   